<!DOCTYPE html>
<html>
  <head>
    <title>vanillicon glyphs preview</title>

    <style>
      /* Page Styles */

      * {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
      }

      body {
        background: #fff;
        color: #444;
        font: 16px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
      }

      a,
      a:visited {
        color: #888;
        text-decoration: underline;
      }
      a:hover,
      a:focus { color: #000; }

      header {
        border-bottom: 2px solid #ddd;
        margin-bottom: 20px;
        overflow: hidden;
        padding: 20px 0;
      }

      header h1 {
        color: #888;
        float: left;
        font-size: 36px;
        font-weight: 300;
      }

      header a {
        float: right;
        font-size: 14px;
      }

      .container {
        margin: 0 auto;
        max-width: 1200px;
        min-width: 960px;
        padding: 0 40px;
        width: 90%;
      }

      .glyph {
        border-bottom: 1px dotted #ccc;
        padding: 10px 0 20px;
        margin-bottom: 20px;
      }

      .preview-glyphs { vertical-align: bottom; }

      .preview-scale {
        color: #888;
        font-size: 12px;
        margin-top: 5px;
      }

      .step {
        display: inline-block;
        line-height: 1;
        position: relative;
        width: 10%;
      }

      .step .letters,
      .step i {
        -webkit-transition: opacity .3s;
        -moz-transition: opacity .3s;
        -ms-transition: opacity .3s;
        -o-transition: opacity .3s;
        transition: opacity .3s;
      }

      .step:hover .letters { opacity: 1; }
      .step:hover i { opacity: .3; }

      .letters {
        opacity: .3;
        position: absolute;
      }

      .characters-off .letters { display: none; }
      .characters-off .step:hover i { opacity: 1; }


      .size-12 { font-size: 12px; }

      .size-14 { font-size: 14px; }

      .size-16 { font-size: 16px; }

      .size-18 { font-size: 18px; }

      .size-21 { font-size: 21px; }

      .size-24 { font-size: 24px; }

      .size-36 { font-size: 36px; }

      .size-48 { font-size: 48px; }

      .size-60 { font-size: 60px; }

      .size-72 { font-size: 72px; }


      .usage { margin-top: 10px; }

      .usage input {
        font-family: monospace;
        margin-right: 3px;
        padding: 2px 5px;
        text-align: center;
      }

      .usage .point { width: 150px; }

      .usage .class { width: 250px; }

      footer {
        color: #888;
        font-size: 12px;
        padding: 20px 0;
      }
    </style>

    <link type="text/css" rel="stylesheet" href="../../design/vanillicon.css">

    <!--[if lte IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

    <script>
      function toggleCharacters() {
        var body = document.getElementsByTagName('body')[0];
        body.className = body.className === 'characters-off' ? '' : 'characters-off';
      }
    </script>
  </head>

  <body class="characters-off">
    <div id="page" class="container">
      <header>
        <h1>vanillicon contains 219 glyphs:</h1>
        <a onclick="toggleCharacters(); return false;" href="#">Toggle Preview Characters</a>
      </header>


      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-adjust" class="icon icon-adjust"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-adjust" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf100;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-agree" class="icon icon-agree"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-agree" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf101;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-align-center" class="icon icon-align-center"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-align-center" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf102;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-align-justify" class="icon icon-align-justify"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-align-justify" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf103;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-align-left" class="icon icon-align-left"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-align-left" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf104;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-align-right" class="icon icon-align-right"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-align-right" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf105;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-android" class="icon icon-android"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-android" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1bf;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-angry" class="icon icon-angry"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-angry" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf106;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-apple" class="icon icon-apple"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-apple" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c0;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-archive" class="icon icon-archive"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-archive" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf107;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-arrow-down" class="icon icon-arrow-down"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-arrow-down" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf108;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-arrow-left" class="icon icon-arrow-left"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-arrow-left" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf109;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-arrow-right" class="icon icon-arrow-right"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-arrow-right" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-arrow-up" class="icon icon-arrow-up"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-arrow-up" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-ban" class="icon icon-ban"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-ban" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-bar-chart" class="icon icon-bar-chart"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-bar-chart" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10d;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-bell" class="icon icon-bell"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-bell" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-bold" class="icon icon-bold"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-bold" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-bookmark" class="icon icon-bookmark"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-bookmark" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf110;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-bookmark-empty" class="icon icon-bookmark-empty"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-bookmark-empty" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf111;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-bug" class="icon icon-bug"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-bug" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf112;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-bullhorn" class="icon icon-bullhorn"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-bullhorn" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf113;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-bullseye" class="icon icon-bullseye"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-bullseye" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf114;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-calendar" class="icon icon-calendar"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-calendar" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf115;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-camera" class="icon icon-camera"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-camera" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf116;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-caret-down" class="icon icon-caret-down"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-caret-down" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf117;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-caret-left" class="icon icon-caret-left"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-caret-left" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf118;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-caret-right" class="icon icon-caret-right"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-caret-right" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf119;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-caret-up" class="icon icon-caret-up"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-caret-up" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-certificate" class="icon icon-certificate"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-certificate" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-check" class="icon icon-check"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-check" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-check-empty" class="icon icon-check-empty"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-check-empty" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11d;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-check-sign" class="icon icon-check-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-check-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-chevron-down" class="icon icon-chevron-down"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-chevron-down" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-chevron-left" class="icon icon-chevron-left"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-chevron-left" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf120;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-chevron-right" class="icon icon-chevron-right"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-chevron-right" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf121;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-chevron-sign-down" class="icon icon-chevron-sign-down"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-chevron-sign-down" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf122;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-chevron-sign-left" class="icon icon-chevron-sign-left"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-chevron-sign-left" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf123;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-chevron-sign-right" class="icon icon-chevron-sign-right"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-chevron-sign-right" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf124;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-chevron-sign-up" class="icon icon-chevron-sign-up"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-chevron-sign-up" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf125;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-chevron-up" class="icon icon-chevron-up"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-chevron-up" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf126;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-circle" class="icon icon-circle"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-circle" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf127;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-circle-blank" class="icon icon-circle-blank"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-circle-blank" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf128;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-cloud" class="icon icon-cloud"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-cloud" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf129;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-cloud-download" class="icon icon-cloud-download"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-cloud-download" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf12a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-cloud-upload" class="icon icon-cloud-upload"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-cloud-upload" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf12b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-code" class="icon icon-code"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-code" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf12c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-cog" class="icon icon-cog"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-cog" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf12d;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-cogs" class="icon icon-cogs"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-cogs" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf12e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-collapse" class="icon icon-collapse"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-collapse" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf12f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-collapse-top" class="icon icon-collapse-top"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-collapse-top" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf130;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-comment" class="icon icon-comment"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-comment" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf131;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-comments" class="icon icon-comments"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-comments" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf132;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-compass" class="icon icon-compass"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-compass" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf133;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-compose" class="icon icon-compose"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-compose" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf134;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-crown" class="icon icon-crown"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-crown" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf135;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-dashboard" class="icon icon-dashboard"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-dashboard" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf136;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-discussion" class="icon icon-discussion"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-discussion" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf137;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-dot-circle" class="icon icon-dot-circle"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-dot-circle" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf138;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-dropbox" class="icon icon-dropbox"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-dropbox" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf139;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-edit" class="icon icon-edit"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-edit" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-edit-sign" class="icon icon-edit-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-edit-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-ellipsis" class="icon icon-ellipsis"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-ellipsis" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-exclamation-sign" class="icon icon-exclamation-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-exclamation-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13d;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-expand" class="icon icon-expand"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-expand" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-external-link" class="icon icon-external-link"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-external-link" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-eye-close" class="icon icon-eye-close"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-eye-close" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf140;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-eye-open" class="icon icon-eye-open"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-eye-open" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf141;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-facebook" class="icon icon-facebook"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-facebook" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf142;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-facebook-alt" class="icon icon-facebook-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-facebook-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf143;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-facebook-alt-round" class="icon icon-facebook-alt-round"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-facebook-alt-round" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c1;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-file" class="icon icon-file"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-file" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf144;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-file-text" class="icon icon-file-text"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-file-text" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf145;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-filter" class="icon icon-filter"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-filter" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf146;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-flag" class="icon icon-flag"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-flag" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf147;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-flame" class="icon icon-flame"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-flame" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf148;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-flickr" class="icon icon-flickr"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-flickr" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c2;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-folder-close" class="icon icon-folder-close"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-folder-close" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf149;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-folder-open" class="icon icon-folder-open"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-folder-open" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf14a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-font" class="icon icon-font"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-font" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf14b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-frown" class="icon icon-frown"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-frown" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf14c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-gift" class="icon icon-gift"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-gift" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf14d;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-github" class="icon icon-github"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-github" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf14e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-github-alt" class="icon icon-github-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-github-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c3;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-github-octocat" class="icon icon-github-octocat"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-github-octocat" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c4;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-globe" class="icon icon-globe"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-globe" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf14f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-google" class="icon icon-google"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-google" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c5;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-google-plus" class="icon icon-google-plus"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-google-plus" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf150;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-google-plus-alt" class="icon icon-google-plus-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-google-plus-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf151;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-group" class="icon icon-group"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-group" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf152;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-hand-down" class="icon icon-hand-down"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-hand-down" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf153;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-hand-left" class="icon icon-hand-left"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-hand-left" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf154;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-hand-right" class="icon icon-hand-right"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-hand-right" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf155;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-hand-up" class="icon icon-hand-up"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-hand-up" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf156;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-heart" class="icon icon-heart"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-heart" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf157;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-home" class="icon icon-home"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-home" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf158;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-inbox" class="icon icon-inbox"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-inbox" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf159;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-indent-left" class="icon icon-indent-left"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-indent-left" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf15a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-indent-right" class="icon icon-indent-right"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-indent-right" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf15b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-info-sign" class="icon icon-info-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-info-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf15c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-instagram" class="icon icon-instagram"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-instagram" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1be;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-italic" class="icon icon-italic"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-italic" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1ba;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jail" class="icon icon-jail"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jail" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf15e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-key" class="icon icon-key"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-key" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf15f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-lightbulb" class="icon icon-lightbulb"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-lightbulb" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf160;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-link" class="icon icon-link"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-link" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf161;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-linkedin" class="icon icon-linkedin"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-linkedin" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf162;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-linkedin-alt" class="icon icon-linkedin-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-linkedin-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf163;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-linux" class="icon icon-linux"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-linux" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c6;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-list-ol" class="icon icon-list-ol"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-list-ol" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf164;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-list-ul" class="icon icon-list-ul"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-list-ul" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf165;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-lock" class="icon icon-lock"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-lock" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf166;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-lol" class="icon icon-lol"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-lol" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf167;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-mail" class="icon icon-mail"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-mail" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf168;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-mail-open" class="icon icon-mail-open"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-mail-open" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf169;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-map-marker" class="icon icon-map-marker"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-map-marker" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf16a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-medium" class="icon icon-medium"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-medium" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c7;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-meh" class="icon icon-meh"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-meh" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf16b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-menu" class="icon icon-menu"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-menu" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf16c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-minus-sign" class="icon icon-minus-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-minus-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf16d;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-mobile-phone" class="icon icon-mobile-phone"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-mobile-phone" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf16e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-mod" class="icon icon-mod"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-mod" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf16f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-move" class="icon icon-move"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-move" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1db;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-nib" class="icon icon-nib"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-nib" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1bb;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-note" class="icon icon-note"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-note" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf170;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-ok" class="icon icon-ok"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-ok" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf171;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-ok-circle" class="icon icon-ok-circle"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-ok-circle" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf172;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-ok-sign" class="icon icon-ok-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-ok-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf173;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-paper-clip" class="icon icon-paper-clip"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-paper-clip" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf174;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-paragraph" class="icon icon-paragraph"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-paragraph" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf175;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-paypal" class="icon icon-paypal"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-paypal" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c8;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-pencil" class="icon icon-pencil"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-pencil" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf176;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-permalink" class="icon icon-permalink"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-permalink" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf177;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-picture" class="icon icon-picture"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-picture" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf178;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-pinterest" class="icon icon-pinterest"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-pinterest" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf179;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-pinterest-alt" class="icon icon-pinterest-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-pinterest-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf17a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-play-circle" class="icon icon-play-circle"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-play-circle" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf17b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-plus-sign" class="icon icon-plus-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-plus-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf17c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-poll" class="icon icon-poll"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-poll" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf17d;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-preview" class="icon icon-preview"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-preview" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf17e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-pushpin" class="icon icon-pushpin"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-pushpin" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf17f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-question" class="icon icon-question"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-question" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf180;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-question-sign" class="icon icon-question-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-question-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf181;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-quote" class="icon icon-quote"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-quote" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf182;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-reddit" class="icon icon-reddit"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-reddit" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1c9;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-reddit-alien" class="icon icon-reddit-alien"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-reddit-alien" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1ca;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-reddit-alt" class="icon icon-reddit-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-reddit-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1cb;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-refresh" class="icon icon-refresh"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-refresh" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf183;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-remove" class="icon icon-remove"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-remove" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf184;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-remove-sign" class="icon icon-remove-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-remove-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf185;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-repeat" class="icon icon-repeat"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-repeat" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf186;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-reply" class="icon icon-reply"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-reply" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf187;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-reply-all" class="icon icon-reply-all"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-reply-all" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf188;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-report" class="icon icon-report"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-report" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf189;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-resize-full" class="icon icon-resize-full"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-resize-full" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf18a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-resize-small" class="icon icon-resize-small"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-resize-small" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf18b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-retweet" class="icon icon-retweet"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-retweet" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf18c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-robot" class="icon icon-robot"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-robot" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1bc;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-rss" class="icon icon-rss"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-rss" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf18d;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-salesforce" class="icon icon-salesforce"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-salesforce" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1bd;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-search" class="icon icon-search"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-search" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf18e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-select" class="icon icon-select"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-select" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf18f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-share" class="icon icon-share"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-share" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf190;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-share-alt" class="icon icon-share-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-share-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1cc;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-share-alt-square" class="icon icon-share-alt-square"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-share-alt-square" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1cd;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-shield" class="icon icon-shield"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-shield" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf191;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-sign-blank" class="icon icon-sign-blank"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-sign-blank" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf192;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-signin" class="icon icon-signin"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-signin" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf193;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-signout" class="icon icon-signout"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-signout" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf194;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-skull" class="icon icon-skull"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-skull" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf195;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-skype" class="icon icon-skype"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-skype" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1ce;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-smile" class="icon icon-smile"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-smile" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf196;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-source" class="icon icon-source"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-source" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf197;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-spam" class="icon icon-spam"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-spam" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf198;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-star" class="icon icon-star"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-star" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf199;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-star-empty" class="icon icon-star-empty"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-star-empty" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf19a;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-star-half-empty" class="icon icon-star-half-empty"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-star-half-empty" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf19b;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-steam" class="icon icon-steam"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-steam" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf19c;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-steam-alt" class="icon icon-steam-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-steam-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1cf;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-strikethrough" class="icon icon-strikethrough"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-strikethrough" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf19d;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-subscript" class="icon icon-subscript"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-subscript" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf19e;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-superscript" class="icon icon-superscript"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-superscript" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf19f;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-table" class="icon icon-table"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-table" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a0;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-tag" class="icon icon-tag"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-tag" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a1;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-tags" class="icon icon-tags"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-tags" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a2;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-th" class="icon icon-th"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-th" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a3;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-th-large" class="icon icon-th-large"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-th-large" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a4;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-th-list" class="icon icon-th-list"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-th-list" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a5;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-thumbs-down" class="icon icon-thumbs-down"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-thumbs-down" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a6;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-thumbs-up" class="icon icon-thumbs-up"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-thumbs-up" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a7;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-ticket" class="icon icon-ticket"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-ticket" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a8;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-time" class="icon icon-time"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-time" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1a9;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-trash" class="icon icon-trash"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-trash" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1aa;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-troll" class="icon icon-troll"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-troll" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1ab;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-trophy" class="icon icon-trophy"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-trophy" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1ac;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-tumblr" class="icon icon-tumblr"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-tumblr" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d0;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-tumblr-alt" class="icon icon-tumblr-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-tumblr-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d1;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-twitter" class="icon icon-twitter"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-twitter" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1ad;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-twitter-alt" class="icon icon-twitter-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-twitter-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1ae;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-underline" class="icon icon-underline"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-underline" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1af;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-undo" class="icon icon-undo"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-undo" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b0;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-unlink" class="icon icon-unlink"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-unlink" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b1;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-unlock" class="icon icon-unlock"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-unlock" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b2;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-user" class="icon icon-user"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-user" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b3;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-vcard" class="icon icon-vcard"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-vcard" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b4;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-video" class="icon icon-video"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-video" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b5;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-vimeo" class="icon icon-vimeo"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-vimeo" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d2;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-vimeo-alt" class="icon icon-vimeo-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-vimeo-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d3;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-vine" class="icon icon-vine"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-vine" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d4;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-warn" class="icon icon-warn"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-warn" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b6;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-warning-sign" class="icon icon-warning-sign"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-warning-sign" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b7;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-windows" class="icon icon-windows"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-windows" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d5;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-wordpress" class="icon icon-wordpress"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-wordpress" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d6;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-wtf" class="icon icon-wtf"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-wtf" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b8;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-yahoo" class="icon icon-yahoo"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-yahoo" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d7;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-yelp" class="icon icon-yelp"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-yelp" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d8;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-youtube" class="icon icon-youtube"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-youtube" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1d9;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-youtube-alt" class="icon icon-youtube-alt"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-youtube-alt" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1da;" />
        </div>
      </div>

      <div class="glyph">
        <div class="preview-glyphs">
          <span class="step size-12"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-zendesk" class="icon icon-zendesk"></i></span>
        </div>
        <div class="preview-scale">
          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
        </div>
        <div class="usage">
          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-zendesk" />
          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf1b9;" />
        </div>
      </div>


      <footer>
        Made with love using <a href="http://fontcustom.com">Font Custom</a>.
      </footer>
    </div>
  </body>
</html>
